import {ThemeContext, themes} from './theme-context';
import HookTestContext from './HookTestContext';
import React, {useState} from "react";

export function ContextApp() {
    const [ theme, setTheme ] = useState(themes.light);

    function toggleTheme() {
        setTheme(prevThemes => prevThemes === themes.dark
            ? themes.light
            : themes.dark)
    }

    return (
        <div>
            <ThemeContext.Provider value={theme}>
                <HookTestContext onClick={toggleTheme}>
                    Change Theme
                </HookTestContext>
            </ThemeContext.Provider>
        </div>
    );

}
